<template>
  <view>
    <u-modal :async-close="true" ref="authModal" v-model="showToMerchantAuthentication" title="商家认证"
             @confirm="confirmAuthShop" show-cancel-button :show-confirm-button="currentDoAuth==='add'" @cancel="cancelModal">
      <scroll-view scroll-y="true" style="height: 20vh;">
        <view style="margin: 20px">
          <span>{{ invitMsg }}</span>
          <u-input @blur="handleBlur" :disabled="isDisabled" v-model="shopAuthForm.invitationCode"
                   placeholder="请输入商家会员的邀请码"/>
          <div v-if="isShowBindShop">绑定商家:<span style="margin-left: 10px">{{ this.shopAuthForm.bindShop }}</span></div>
          <div v-if="currentDoAuth==='edit'" style="margin-top: 10px">绑定时间:<span style="margin-left: 10px">{{ timestampToTime(shopAuthForm.authDate) }}</span></div>
        </view>

      </scroll-view>
    </u-modal>

  </view>
</template>

<script>
const userAPI = require('../../../utils/api/user.js').default;
const shopAPI = require('../../../utils/api/shops.js').default;
const $ = require('../../../utils/api.js');
let self;
export default {
  name: "toUserAuth",
  computed: {},
  props: {
    isDisabled: {
      type: Boolean,
      default: false
    },
    invitMsg: {
      type: String,
      default: ''
    },
    currentDoAuth: {
      type: String,
      default: ''
    },
    invitationCode: {
      type: String,
      default: ''
    },

  },
  data() {
    return {
      isShowBindShop: false,
      showToMerchantAuthentication: false,
      shopAuthForm: {
        invitationCode: '',
        bindShop: '',
        authDate: ''
      },
    }
  },
  methods: {
    timestampToTime(timestamp) {
      var time = new Date(timestamp);
      var Year = time.getFullYear();
      var Moth = time.getMonth()+1;
      var Day = time.getDate();
      var Hour = time.getHours();
      var Minute = time.getMinutes();
      var Sechond = time.getSeconds();
      return Year + '-' + Moth + '-' + Day + '   ' + Hour + ':' + Minute + ':' + Sechond;
    },

    cancelModal() {
      this.isShowBindShop = false
    },
    handleBlur(data) {
      let self = this
      self.shopAuthForm.bindShop = ""
      self.isShowBindShop = true
      //搜索店铺
      $.ajax({
        url: shopAPI.getShopByInviteCode,
        data: {
          "inviteCode": data
        },
        method: 'GET',
        success(res) {
          self.shopAuthForm.bindShop = res.data.name
        }
      })
    },
    init(authFromInvitCode, authDate, bindShop) {
      if (authFromInvitCode) {
        this.isShowBindShop = true
        this.shopAuthForm.invitationCode = authFromInvitCode
        this.shopAuthForm.bindShop = bindShop
        this.shopAuthForm.authDate = authDate
      } else {
        this.isShowBindShop = false
        this.shopAuthForm.invitationCode = this.invitationCode
        this.shopAuthForm.bindShop = bindShop
      }

      if (bindShop) {
        this.shopAuthForm.bindShop = bindShop
      }

      this.showToMerchantAuthentication = true;
    },


    tabsClick(item) {
      console.log('item', item);
    },
    tabsChange(index) {
      this.tabsCurrent = index;
    },
    confirmAuthShop() {

      this.$refs.authModal.clearLoading();

      if (!this.shopAuthForm.invitationCode) {
        $.$toast('邀请码不能为空');
        return;
      }


      //请求后端执行商家认证
      const self = this;
      $.ajax({
        url: userAPI.shopAuth,
        data: self.shopAuthForm,
        method: 'POST',
        loading: true,
        success(res) {
          let newMember = res.data.verityMember
          uni.setStorageSync('userInfo', newMember);
          let initialAuthDownloadNumVideo = res.data.initialAuthDownloadNumVideo
          let initialAuthDownloadNumImg = res.data.initialAuthDownloadNumImg
          let msgSuccess = ""
          if (initialAuthDownloadNumVideo && initialAuthDownloadNumImg) {
            msgSuccess = ",您已经拥有：短视频下载次数：" + initialAuthDownloadNumVideo + "次," + "图片下载次数：" + initialAuthDownloadNumImg + "次，请到申请记录中查看"
          } else if (initialAuthDownloadNumVideo && !initialAuthDownloadNumImg) {
            msgSuccess = ",您已经拥有：短视频下载次数：" + initialAuthDownloadNumVideo + "次，请到申请记录中查看"
          } else if (!initialAuthDownloadNumVideo && initialAuthDownloadNumImg) {
            msgSuccess = ",您已经拥有：图片下载次数：" + initialAuthDownloadNumImg + "次，请到申请记录中查看"
          } else {
            msgSuccess = ""
          }
          // self.isShowMerchantAuthentication = false
          // self.isShowSuccessAuth = true
          // /*#ifdef H5*/
          // self.$parent.$parent.updateAuthStatus()
          // /*#endif*/
          //
          // /*#ifdef MP*/
          // self.$parent.updateAuthStatus()
          // /*#endif*/
          //重新加载一下首页
          self.$emit("updateAuthStatus")
          self.$emit("indexGgRefresh")
          self.showToMerchantAuthentication = false
          if (self.currentDoAuth === 'add') {
            uni.showModal({
              title: '提示',
              showCancel: false,
              content: '恭喜！认证成功' + msgSuccess,
              success: function (res) {
              }
            })
            this.isShowBindShop = false
          } else {
            $.$toast('操作成功');
          }
        }
      })
    },
  }
}
</script>

<style scoped>
page {
  background: #f2f2f2;
}

.flex-x {
  display: flex;
  align-items: center;
}

.template_title,
.template_title1,
.template_title_list {
  height: 180rpx;
  background: #fff;
  justify-content: space-between;
  padding: 0 30rpx;
  box-sizing: border-box;
}

.template_title1 {
  background: none;
}

.template_title_list {
  margin-bottom: 4rpx;
}

.template_title > view,
.template_title1 > view {
  font-size: 32rpx;
  color: #8f8f8f;
  flex-shrink: 0;
  margin-right: 20rpx;
}

.template_title > input {
  font-size: 28rpx;
  color: #808080;
  text-align: right;
  flex-grow: 1;
}

/* 添加内容 */

.add_con > text {
  font-size: 40rpx;
  color: #f16765;
  display: block;
  margin-right: 20rpx;
  margin-left: 10rpx;
  line-height: 44rpx;
}

.add_con > view {
  font-size: 32rpx;
  color: #7885cb;
}

/* 删除内容 */

.del {
  font-size: 32rpx;
  color: #f16765;
  margin-right: 14rpx;
  padding: 20rpx;
}

input {
  flex-grow: 1;
  font-size: 28rpx;
  color: #808080;
}

.btn {
  margin-top: 100rpx;
}

</style>
